@charset "utf-8";
@function vw($pg){
    @return 100*$pg/750+vw;
}
$color:#ff9344;
*{
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
}
//这是头部
header{
    width: vw(750);
    height: vw(150);
    background:white;
    display: flex;
    justify-content:space-around;
    align-items: center;
}
.logo{
    width:vw(123);
    height:vw(123);
    line-height: vw(123);
    .lo{
        width:vw(123);
        height: vw(57);
        border: 1px solid $color;
        background: #fff;
        border-radius: vw(19);
    }
}
.int{
    width: vw(266);
    height: vw(50);
    line-height: vw(50);
    border-radius: vw(50);
    text-align:center;
    
    input{
        margin-left:vw(30);
        width: vw(168);
        appearance: none;
        border:none;
        outline: none;
        font-size: vw(24);
    }
    i{
        color: $color;
        font-size:vw(30);
    }
}
.city{
    width:vw(159);
    height:vw(56);
    line-height:vw(56);
    font-size:vw(26);
    position: relative;
    select{
        width: 100%;
        height: 100%;
        padding-left:vw(10);
        border: 1px solid $color;
        -webkit-appearance: none;
    }
}
.city::after{
    content: "";
    display: inline-block;
    width: 0;
    border-width: vw(20) vw(16);
    border-style: solid;
    border-color: $color transparent transparent transparent;
    position: absolute;
    top: vw(20);
    right:vw(23);
}
//图标头部
.icon{
    width: vw(159);
    height: vw(50);
    display:flex;
    justify-content:flex-end;
    align-items: center;
    img{
        width: vw(62);
        height: 100%;
    }
}
//主题内容设置
main{
    width: vw(750);
    display: flex;
    justify-content:space-between;
    align-items: center;
    flex-direction: column;
}
//小标题
.like{
    width: vw(708);
    display: flex;
    justify-content: space-between;
    .left{
        width: vw(193);
        display:flex;
        justify-content: space-between;
        // margin-left: vw(10);
        align-items: center;
        p{
            font-size: vw(30);
            align-self:center;
        }
        img{
            width: vw(56);
            height: vw(54);
        }
    }
    .right{
        width: vw(80);
        display:flex;
        align-items: center;
        font-size: vw(24);
        // margin-right: vw(20);
       justify-content: space-between;
        img{
            width: vw(25);
            height: vw(26);
        }
    
    }
}
//这是底部
footer{
    width: vw(750);
    height: vw(107);
    display: flex;
    justify-content: space-around;
    align-items:center;
    background:#fff;
    position: fixed;
    bottom: 0;
    a{
        display: flex;
        flex-direction: column;
        align-items: center;
        color:#000 ;
        justify-content: center;
        .iconfont{
            font-size: vw(73);
            color: $color;
        }
    }
}